<!--
 * @Author: fisher
 * @Date: 2022-10-20 17:35:47
 * @LastEditTime: 2022-10-26 10:48:21
 * @LastEditors: fisher
 * @Description: 
 * @FilePath: \test\copy_index.html
-->
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link rel="stylesheet" href="./index.css">
    <link rel="stylesheet" href="./leftbar.css">

    <title>Document</title>
</head>

<body>
    <div class="background"></div>
    <div class="header">
        <p id="datetime" onload=myDate()></p>
        <!-- 注意元素相对父元素居中的方式 -->

        <!-- 比较紧凑的零散元素，可以用一个div统一包起来 -->
        <div class="header_right">
            <img class="header_right_shezhiicon" src="首页_slices\205设置@2x.png" alt="">
            <span class="header_right_shezhi">设置</span>
            <img class="header_right_touxiang" src="首页_slices\touxiang.png" alt="">
        </div>
        <!-- <p id="top-title">
            <img src="首页_slices\组 105@2x.png" alt="biaoti">
        </p> -->
        <!-- <p id="top-layer"><img src="首页_slices\样式八@2x.png" alt="tup">
        </p> -->
        <img id="top-layer" src="首页_slices\样式八@2x.png" alt="bg">
        <img id="top-title" src="首页_slices\组 105@2x.png" alt="logo">

    </div>

    <div class="rightbar" width="72px" height="68px">
        <a href=""><img src="首页_slices\蒙版组 3@2x.png" alt=""></a>
        <a href=""><img src="首页_slices\蒙版组 4@2x.png" alt=""></a>
        <a href=""><img src="首页_slices\蒙版组 47@2x.png" alt=""></a>
        <a href=""><img src="首页_slices\蒙版组 6@2x.png" alt=""></a>
        <a href=""><img src="首页_slices\蒙版组 48@2x.png" alt=""></a>
        <a href=""><img src="首页_slices\蒙版组 49@2x.png" alt=""></a>
        <a href=""><img src="首页_slices\蒙版组 65@2x.png" alt=""></a>
    </div>

    <div class="leftbar">
        <!-- 建议布局结构 -->
        <div class="catalogue">
            <div class="catalogue_title">
                <img src="首页_slices\蒙版组 50@2x.png" alt="icon">
                <span>项目区位</span>
            </div>
            <div class="catalogue_content">
                <span>项目区位</span>
            </div>
        </div>
        <div class="catalogue">
            <div class="catalogue_title">
                <img src="首页_slices\蒙版组 62@2x.png" alt="icon">
                <span>现状概况</span>
            </div>
            <div class="catalogue_content">
                <span>南山水厂现状</span>
                <span>地块用地条件</span>
                <span>地下空间规划</span>
                <span>地面交通规划</span>
            </div>
        </div>
        <div class="catalogue">
            <div class="catalogue_title">
                <img src="首页_slices\蒙版组 62@2x.png" alt="icon">
                <span>上位规则</span>
            </div>
            <div class="catalogue_content">
                <span>总平面图布置</span>
                <span>分期实施方案</span>
                <span>地块规划方案</span>
            </div>

        </div>
        <div class="catalogue"></div>
    </div>




    <img class="bottom" src="首页_slices\底部@2x.png" alt="">


</body>
<script src="https://cdn.bootcdn.net/ajax/libs/dayjs/1.11.6/dayjs.min.js"></script>
<script>
    let timer = {}
    window.onload = () => {
        timer = setInterval(() => {
            document.getElementById("datetime").innerHTML = dayjs().format("YYYY/MM/DD HH:mm:ss")
        }, 1000);
    }
</script>

</html>